<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ppctu="http://primefaces.prime.com.tr/ui"
      xmlns:f="http://java.sun.com/jsf/core">

    <body>

        <ui:composition template="./Template/Template.xhtml">

            <ui:define name="title">
                XPath Tool
            </ui:define>

            <ui:define name="top">
                XPath Tool
            </ui:define>

            <ui:define name="left">
                Menu
            </ui:define>

            <ui:define name="content">
                <h:form>
                    <ppctu:messages id="msg" showDetail="true" showSummary="true"/>

                    <h4 align="center">XPath Tool</h4>
                    <ppctu:fileUpload allowTypes="*.xml;" 
                                      description="XML file" 
                                      update="contentPanel,button,xmlList,history"
                                      fileUploadListener="#{xPathController.uploadFileHandler}"/>

                    <br/><br/>
                    <h:outputLink value="javascript:void(0)" onclick="History.show()">
                        <i>Uploaded files</i></h:outputLink>  
                    <br/><br/>

                    <ppctu:dialog widgetVar="History" header="uploaded files" width="450" 
                                  resizable="true" showEffect="fold" hideEffect="clip">
                        <ppctu:outputPanel id="history">
                            <h:panelGrid columns="1" style="text-align: center;">
                                <h:outputText style="font-weight: 700" value="xml files"/>

                                <h:selectOneListbox id="xmlList" value="#{xPathController.xmlFile}" style="min-width: 100px; height: 150px;">
                                    <f:selectItems value="#{fileList.xmlKeys}"/>
                                    <ppctu:ajax update="contentPanel,button"/>
                                </h:selectOneListbox>
                            </h:panelGrid>
                        </ppctu:outputPanel>
                    </ppctu:dialog>
                    <br/>
                    <table style="width:100%; background-color: #ffffff;" cellspacing="5px">                        
                        <tr>
                            <td>
                                <b>XPath Expression :</b>
                                <h:inputText style="width:480px;" value="#{xPathController.xPathExpression}" /><br />
                                <b>Output :</b>

                                <h:selectOneMenu style="width:115px;color: darkgreen;" value="#{xPathController.returnType}">
                                    <f:selectItem itemValue="Node"/>
                                    <f:selectItem itemValue="Node List"/>
                                    <f:selectItem itemValue="Numberic"/>
                                    <f:selectItem itemValue="Boolean"/>
                                    <f:selectItem itemValue="String"/>
                                </h:selectOneMenu>
                                <ppctu:outputPanel id="button">
                                    <h:commandButton style="font-weight: 700" value="Submit" 
                                                     action="#{xPathController.execute}" 
                                                     disabled="#{!xPathController.ready}"/>
                                </ppctu:outputPanel>
                            </td>
                        </tr>
                        <tr>
                            <td style="background-color: #CCFFFF">
                                <b>Result :</b>
                                <br />
                                <h:outputText escape="false" value="#{xPathController.result}"/>
                            </td>
                        </tr>
                        <tr>
                            <td style="background-color:#F7FAFE;">
                                <ppctu:outputPanel id="contentPanel">
                                    <ppctu:panel header="#{xPathController.xmlFile}" toggleable="true"   
                                                 toggleSpeed="500"  widgetVar="panel" rendered="#{xPathController.ready}"
                                                 style="width: 99%; max-height: 300px;overflow: auto;max-width: 620px;" >
                                        <pre><h:outputText value="#{xPathController.xmlContent}"/></pre>
                                    </ppctu:panel>
                                </ppctu:outputPanel>
                            </td>
                        </tr>
                    </table>
                </h:form>
            </ui:define>

            <ui:define name="bottom">
                bottom
            </ui:define>

        </ui:composition>

    </body>
</html>
